/*
 * @Descripttion: 
 * @Author: yangj
 * @LastEditors: yangj
 * @Date: 2019-11-19 15:43:25
 * @LastEditTime: 2019-11-19 18:20:36
 */

import {createAppContainer} from 'react-navigation'
import { createBottomTabNavigator } from 'react-navigation-tabs';
import { createStackNavigator } from 'react-navigation-stack';
import Ionicons from 'react-native-vector-icons/Ionicons';
import Home from '../view/home'
import List from '../view/list'
import Detail from '../view/detail'
//创建一个Tab导航
const TabNavigator = createBottomTabNavigator(
//第一个参数为导航路由的映射RouteConfigs
{
    Home: {
        //screen为Component或者Navigator
        screen: Home,
        //导航选项
        navigationOptions: {
            tabBarLabel: 'home',
        },
    },
    List: {
        screen: List,
        //导航选项
        navigationOptions: {
            tabBarLabel: 'list',
        },
    }
}, 
//第二个参数为导航的一些基本配置对象StackNavigatorConfig
{
    // defaultNavigationOptions: ({ navigation }) => ({
    //     //自定义tabBar的icon
    //     tabBarIcon: ({ focused, horizontal, tintColor }) => {
    //         const { routeName } = navigation.state;
    //         let iconName;
    //         console.log("routeName === 'User'",navigation);
    //         if (routeName === 'Home') {
    //             iconName = 'md-planet';
    //         } else if (routeName === 'List') {
    //             iconName = `md-rocket`;
    //         }
    //         return <Ionicons name={iconName} size={25} color={tintColor} />
    //     },
    // }),
    // animationEnabled: false,
    // swipeEnabled: false,
    // //tabBar的options样式
    tabBarOptions: {
        activeTintColor: '#24292e',
        inactiveTintColor: '#888',
        labelStyle: {
            fontSize: 12,
        },
        style: {
            backgroundColor: 'white'
        },
        allowFontScaling: false
    },
    // mode: 'card',//card/modal 切换动画,不确定是不是写在这儿
    // headerBackTitleVisible: false,//提供合理的默认值以确定后退按钮标题是否可见,不确定是不是写在这儿
    //默认初始路由
    initialRouteName: 'Home',
})

//创建一个Stack导航，其中Tab路由的screen即是Tab导航
const AppNavigator = createStackNavigator({
    Tab:{
        screen:TabNavigator
    },
    Detail:{
        screen: Detail
    }
},{
    initialRouteName: 'Tab'
    //你的其他配置，此处省略
})
//最后使用createAppContainer返回Component给入口App.js使用
export default createAppContainer(AppNavigator);